.wrap {
  padding: 0 20px;
}
.search{
    width: 100%;
    height: 60px;
    background-color: #fff;
    position: relative;
}
.grid3{
    margin-top: 20px;
    width: 100%;
    height: 140px;
}
.grid-item3{
    width: 100%;
    height: 300px;
    display:flex;
    justify-content: space-around;
    flex-wrap: wrap;
}
.grid-item3 dl{
    width: 17%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.grid-item3 img{
    width: 80px;
    height: 80px;
    border: 50%;  
}


/* 
在做项目时，我们要考虑到我们做的页面要实现在不同的设备上，
显示不同的布局这时就要做到统一就是使用rem时会出现换算不清而导致页面结构出现问题，
这个时候我们就可以使用淘宝的flexible去解决它。
而flexible只用作于适配，如果想使px转换为rem时候，我们就要用到postcss这个插件，
转换的原理就是假设页面的高为750px,分为10份，那么每份就是75px，当宽或高为100px时，
就用100px去除以75这个基准值，得到1.3333rem
*/


.foote{
  width: 100%;
  height: 100%;
  margin-top: 160px;
}

.onebox{
    width: 100%;
    height: 200px;
    display: flex;
    justify-content: space-around;
}
.onee{
  margin-top: 30px;
}
.onee img{
    width: 160px;
    height: 190px;
}
.sskuan{
    width: 97%;
    height: 70px;
    border-radius: 35px;
   position: relative;
   border:3px solid  #e35a36;
 
}
.bosp{
    width: 97%;
    height: 80px;
    position: relative;
    margin-bottom: 15px;
}



.van-search__content{
    border: 3px solid red; 
}
.btn{
   
    width: 105px;
    height: 62px;
    position: absolute;
    top: 25px;
    right: 10px;
    border-radius:  50px;
    border: none;
    color: #fff;
    background-color: #fe4a29;
    text-align: center;
    
   
}
.qie{
    margin-top: 20px;
    
}
.van-search{
    width: 710px;
}

.fff{
    width: 300px;
    height: 500px;
    margin-right: 30px;
   
}
.fff img{
    width: 300px;
    height: 300px;
  }
  .goodslist{
  margin-top: 20px;
  column-count: 2;
  }
  .van-swipe-item img{
    width: 100%;
  }

.goods img{
  width: 350px;
  height: 330px;
}
.msg{
  margin-bottom: 20px;
}